<!DOCTYPE HTML>
<html>
<head>
<title>BI Administration</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="Stylesheet" type="text/css" href="theme/css/style_reset.css" />
<link rel="Stylesheet" type="text/css" href="theme/css/style.css" />
<link rel="Stylesheet" type="text/css" href="theme/css/style_admin.css" />
<link rel="Stylesheet" type="text/css" href="theme/css/ui.dynatree.css" />
<link rel="Stylesheet" type="text/css" href="api/css/cupertino/jquery-ui-dialog.css" />
<link rel="Stylesheet" type="text/css" href="api/css/jquery.contextMenu.css" />
<script type="text/JavaScript" src="api/js/jquery-1.8.3.js"></script>
<script type="text/javascript" src="api/js/jquery-ui-1.10.3.custom.min.js"></script>
<script type="text/JavaScript" src="theme/script/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="api/js/jquery.dynatree.js"></script>
<script type="text/javascript" src="api/js/jquery.contextMenu.js"></script>
<script type="text/JavaScript" src="theme/script/custom.js"></script>
<script type="text/javascript" src="api/boi.js"></script>
<script type='text/JavaScript' src='../zbw_reporting/scripts/framework_include.js'></script>

<!-- Tabs Hide/Show -->
<style type="text/css">
    .ui-tabs .ui-state-disabled {
        display: none; /* disabled tabs don't show up */
    }
</style>


<!-- tabs -->
<script type="text/javascript">
    $(function () {
        $("#tabs-center").tabs();
        $("#tabs-center").tabs("option", "disabled", [0, 1, 2, 3, 4, 5, 6, 7, 8]);
        // $(window).bind('resize', resize);
        // $(window).bind('load', resize);
    });
    var resize = function () {
        $('iframe').each(function () {
            $(this).height($(window).height() - 230);
        });
    };
</script>

<!-- BI Apps Admin -->
<script type="text/javascript">

    var app_id = "";
    var current_app, current_node;
    var cat_init = false;

    $(function () {
        BOIData.debugWindow = $('#bi_debug');
    });

    function refreshApps(appl_id) {

        app_id = appl_id;

        $(bi_app_tree_id).dynatree('destroy');
        loadAppTree();

        //$(bi_app_tree_id).html('');
        //$(bi_app_tree_id).dynatree('destroy');

        //BOIData.list.getApps(function (data) {
        //   $(bi_app_tree_id).dynatree('destroy');
        //$(bi_app_tree_id).dynatree("option", "children", $.parseJSON(data));
        //$(bi_app_tree_id).dynatree("getTree").reload();
        //});
    }
    function refresh(node_id, mode) {
        //alert('Refreshing for node ' + node_id + ' in mode ' + mode);
        if (mode == "UPDATE") {
            //activate the corresponding node
            reloadTree(node_id, true);
        }
        else if (mode == "CREATE") {
            //activate the corresponding node
            reloadTree(node_id, true);
        }
        else if (mode == "DELETE") {
            //activate the corresponding node
            reloadTree(undefined, true);
        }
    }
    function reloadVariables() {
        $('#bi_node_var_edit').attr('src', "admin/bi_admin_report_edit_variables.html");
    }
    function reloadAssignment() {
        $('#bi_node_var_assign').attr('src', "admin/bi_admin_report_assign_variables.html");
    }

    function reloadTree(node_id, refresh) {
        /**/
        if (refresh && cat_init) {
            $(bi_cat_tree_id).dynatree('destroy');

            //$(bi_cat_tree_id).html('');
            //$(bi_cat_tree_id).dynatree("getTree").reload();
        }

        BOIData.list.getCatalog(current_app.data.key, undefined, undefined, function (data) {
            var isXml = true;
            try {
                isXml = $.parseXML(data);

            } catch (e) {
                isXml = false;
            }
            if (isXml == false) {
                if (node_id)
                    loadCatTree($.parseJSON(data), node_id);
                else
                    loadCatTree($.parseJSON(data));
                $(bi_cat_tree_id).show();
                $('#bi_cat_panel p').html('');
            }
            else {
                loadCatTree($.parseJSON("[{}]"));
                $(bi_cat_tree_id).hide();
                $('#bi_cat_panel p').html($(data).find('ERROR').text() + '. ' + $(data).find('MESSAGE').text());
            }
        });

    }

    function setDisplay(node_type, mode) {
        var tabs = $("#tabs-center");
        if (mode == 'CREATE') {
            tabs.tabs("option", "disabled", [1, 2, 3, 4, 5, 6, 7, 8]); // hide non relevant
            tabs.tabs({ active: 0 }); // select active
            $('#tab-panel-center-1').click();
            return;
        }

        switch (node_type) //what tabs to show
        {
            case "S_FOLDER":
            case "M_FOLDER":
            case "BW_ROLE":
                tabs.tabs("option", "disabled", [1, 2, 3, 4, 5, 6, 7, 8]); // hide non relevant
                break;
            case "REPORT_GROUP":
                tabs.tabs("option", "disabled", [1, 3, 4, 5, 7, 8]); // hide non relevant
                break;
            case "GROUP":
            case "APP":
                tabs.tabs("option", "disabled", [1, 2, 3, 4, 5, 6, 7, 8]); // hide non relevant
                break;
            default:
                if (current_node.data.type == "KPI")
                    tabs.tabs("option", "disabled", [2, 3, 4, 5, 6, 7]); // hide non relevant
                else if (current_node.getParent().data.type == "REPORT_GROUP")
                    tabs.tabs("option", "disabled", [2, 3, 4, 5, 6, 7, 8]); // no layout assignment for children
                else
                    tabs.tabs("option", "disabled", [3, 4, 5, 6, 7, 8]); // hide non relevant
                break;
        }
        tabs.tabs({ active: 0 }); // select active
        $('#tab-panel-center-1').click();
    }

    function deleteApp(node_id) {
        var records, record, param, req, class_name, method_name;
        records = [];
        class_name = "ZCL_MYBW_APP_CATALOG";
        method_name = "DELETE";

        record = new BOIData.Record();

        param = new parent.BOIData.Parameter();
        param.name = 'NODE_ID';
        param.values = [node_id];
        record.parameters.push(param);

        records.push(record);

        req = BOIData.request.prepare(class_name, method_name, records);
        BOIData.request.perform(req, 'text', 'POST', function (data) {
            //refresh tree
            //current_node = current_app.data.key;
            refreshApps(undefined);
            BOI.BOILib.Util.log($(data).find('MESSAGE').text(),true);
        });
    }

    function deleteNode(node_id, key) {
        var records, record, param, req, class_name, method_name;
        records = [];
        class_name = "ZCL_MYBW_REP_CATALOG";
        method_name = "DELETE";

        record = new BOIData.data.createRecord({
            APP_ID:[app_id],
            NODE_ID: [node_id],
            TECH_NAME: [key]
        });

        records.push(record);

        req = BOIData.request.prepare(class_name, method_name, records);
        BOIData.request.perform(req, 'text', 'POST', function (data) {
            //refresh tree
            //current_node = undefined;
            var tree = $(bi_cat_tree_id).dynatree("getTree");
            var node = $(bi_cat_tree_id).dynatree("getRoot").childList[0];
            reloadTree(node.data.key, true);
            // alert($(data).find('MESSAGE').text());
            BOI.BOILib.Util.log($(data).find('MESSAGE').text(),true);
        });
    }
</script>

<!-- BI Apps List -->
<script type="text/javascript">

    function activateAppNode(key) {
        if (key) {
            current_app = node;
            // Get the DynaTree object instance:
            var tree = $(bi_app_tree_id).dynatree("getTree");
            // Use it's class methods:
            tree.activateKey(key);

            // Get a DynaTreeNode object instance:
            //var node = tree.getNodeByKey("key7654");

            var node = tree.getNodeByKey(key);
            activateApp(node);
        }
    }
    function activateApp(node) {
        current_node = node;

        $('iframe#bi_node_details').attr('src', 'admin/bi_admin_app_edit.html');

        setDisplay(node.data.type, 'UPDATE');
    }

    var bi_app_tree_id = "#bi_apps_tree";


    var is_initial = true;
    function activateAccordions()
    {
        if(is_initial){
            $( ".first_not_enabled" ).removeClass("ui-state-disabled");
        }
    }

    function loadAppTree() //use data later
    {
        $.ui.dynatree.nodedatadefaults["icon"] = false;
        BOIData.list.getAllApps(function (data) {
            $(bi_app_tree_id).dynatree({
                fx: { height: "toggle", duration: 200 },
                clickFolderMode: 1, // 1:activate, 2:expand, 3:activate and expand
                minExpandLevel: 2,
                persist: false,
                selectMode: 1,
                children: $.parseJSON(data),
                onCreate: function (node, span) {
                    //store needed info for context menu usage
                    $(span).attr("key", node.data.key);
                    $(span).attr("isFolder", node.data.isFolder ? 'true' : 'false');
                    $(span).attr("type", node.data.type);
                    $(span).attr("editable", node.data.editable);
                    $(span).attr("nodeid", node.data.nodeID);
                    $(span).attr("role", node.data.role);

                    $(span).attr('href', '');
                },
                onActivate: function (node) {
                    current_app = node;
                    //$('#accordion-west').accordion('selected', 1);

                    if (node.data.type == 'APP') {
                        app_id = node.data.key;
                        BOIData.app_id = app_id;
                        reloadTree(undefined, true);
                        $('#bi_cat_panel p').html('');
                        $('#bi_rep_cat_current').html('Report Catalog - ' + node.data.title);
                        $('#bi_app_cat_current').html('BI Apps - ' + node.data.title);

                        activateAccordions();

                    }
                    else {
                        BOIData.app_id = 'ALL';
                        $(bi_cat_tree_id).hide();
                        $('#bi_cat_panel p').html('Please select an App to view its catalog.');
                    }

                    setDisplay(node.data.type, 'UPDATE');

                    refreshTemplates();
                    refreshViews();
                    refreshComponents();
                    $('#bi_node_details').attr('src', 'admin/bi_admin_app_edit.html');

                    //activateFunc(node.data.title,  node.data.id);
                    //node.addChild({id: "MYID", title: "MYTITLE"});
                    //node.removeChild(node.getPrevSibling());
                },
                onPostInit: function () {
                    /*
                     $(bi_app_tree_id).dynatree("getRoot").visit(function (node) {
                     node.expand(true);
                     });*/

                    activateAppNode(app_id);
                }
            });
        });


    }

    var matches = [];
    var current_match;
    //initialize
    $(function () {
        loadAppTree();

        $('#bi_apps_tree_search, #bi_cat_tree_search').live('keyup', function () {


            var textbox = $(this);
            var term = textbox.val().toLowerCase();

            var is_app_tree = textbox.attr('id') == 'bi_apps_tree_search';
            var tree_id = is_app_tree ? bi_app_tree_id : bi_cat_tree_id;

            var tree = $(tree_id).dynatree("getTree");
            if (term.length < 3) {
                tree.visit(function (node) {
                    node.data.addClass = '';
                });
                tree.redraw();
                return;
            }

            var match = null;
            matches = []; //clear
            tree.redraw();
            tree.visit(function (node) {
                //highlight all matches
                node.data.addClass = '';
                if (node.data.title.toLowerCase().indexOf(term) > -1) {

                    node.makeVisible();
                    node.data.addClass = 'highlight';
                    matches.push(node);


                    //return false; // stop traversal (if we are only interested in first match)
                }
            });

            //select first match
            if (matches.length > 0) {
                var node = matches[0];
                current_match = 0;
                var activeLi = node.li;

                var container = $(tree_id + ' .dynatree-container');
                if (activeLi)
                    container.animate({
                        scrollTop: $(activeLi).offset().top - container.offset().top + container.scrollTop()
                    }, 'fast');
                tree.activateKey(node.data.key);
                textbox.focus();
            }


        });

        $('#bi_apps_tree_search_next, #bi_cat_tree_search_next').live('click', function () {

            var is_app_tree = $(this).attr('id') == 'bi_apps_tree_search_next';
            var tree_id = is_app_tree ? bi_app_tree_id : bi_cat_tree_id;

            if (matches.length > 0) {
                if (current_match == matches.length - 1) //last match?
                {
                    current_match = 0;
                }
                else {
                    current_match++;
                }

                var node = matches[current_match];
                var activeLi = node.li;

                var container = $(bi_app_tree_id + ' .dynatree-container');
                if (activeLi)
                    container.animate({
                        scrollTop: $(activeLi).offset().top - container.offset().top + container.scrollTop()
                    }, 'fast');
                var tree = $(tree_id).dynatree("getTree");
                tree.activateKey(node.data.key);
                $('#' + $(this).attr('id').replace('_next','')).focus();
            }
        });
    });
</script>

<!-- Current BI App's Catalog List -->
<script type="text/javascript">
function activateCatNode(key) {
    var tree = $(bi_cat_tree_id).dynatree("getTree");
    //alert(key);
    if (key) {
        tree.selectKey(key);
        tree.activateKey(key);
        //activate(tree.getActiveNode());
        //var node = tree.getNode(key);
        //alert(node.data.key);


        // Get a DynaTreeNode object instance:
        var node = tree.getNodeByKey(key);
        activate(node);
    }
    else {
        //activate(tree.getRoot().childList[0]);
    }
}

var bi_cat_tree_id = "#bi_cat_tree";

function loadCatTree(data, activateKey) //use data later
{

    $(bi_cat_tree_id).dynatree({
        fx: { height: "toggle", duration: 200 },
        clickFolderMode: 1, // 1:activate, 2:expand, 3:activate and expand
        minExpandLevel: 2,
        persist: false,
        selectMode: 1,
        children: data,
        onCreate: function (node, span) {
            //store needed info for context menu usage
            $(span).attr("key", node.data.key);
            $(span).attr("isFolder", node.data.isFolder ? 'true' : 'false');
            $(span).attr("type", node.data.type);
            $(span).attr("editable", node.data.editable);
            $(span).attr("nodeid", node.data.nodeID);
            $(span).attr("role", node.data.role);

            $(span).attr('href', '');
        },
        onActivate: function (node) {
            activate(node);
            //activateFunc(node.data.title,  node.data.id);
            //node.addChild({id: "MYID", title: "MYTITLE"});
            //node.removeChild(node.getPrevSibling());
        },
        onPostInit: function () {
            cat_init = true;
            /*$(bi_cat_tree_id).dynatree("getRoot").visit(function (node) {
             node.expand(true);

             });*/
            activateCatNode(activateKey);

        }
    });
}

function activate(node) {
    current_node = node;


    $('iframe#bi_node_details').attr('src', 'admin/bi_admin_report_edit.html');
    $('iframe#bi_node_var_edit').attr('src', 'admin/bi_admin_report_edit_variables.html');
    $('iframe#bi_node_var_assign').attr('src', 'admin/bi_admin_report_assign_variables.html');

    if (node.data.type == "REPORT_GROUP"){
        $('iframe#bi_node_rep_assign').attr('src', 'admin/bi_admin_report_assign_reports.html');
    }
    if (node.data.type == 'KPI')
    {
        $('iframe#bi_kpi_details').attr('src', 'admin/bi_admin_kpi_edit.html');
        //$('iframe#drill_down_details').attr('src', 'admin/bi_admin_drill_down_det.htm');
    }
    setDisplay(node.data.type, 'UPDATE');
}
//initialize
$(function () {
    //this will be overridden by BOI JS INTEGRATION and will no longer be needed
    //reloadTree();

    for (var i in node_types)
        createMenu(node_types[i]);

    $('.context-menu-list').css('z-index', '100');

    //disable menus for non-editable items
    $('[editable="false"]').live('contextmenu', function (e) {
        return false;
    });

});
var node_types = ['M_FOLDER', 'S_FOLDER', 'BW_ROLE', 'BW_BEX3', 'BW_BEX7','BW_WAD7','BW_WAD3',
    'BO_WEBI', 'BO_CRYSTAL', 'BO_DASHBOARD','BW_DASHBOARD', 'REPORT_GROUP', 'F', 'GROUP', 'APP', 'KPI', 'URL', 'FLASH'];
function getMenu(node_type) {
    var items;
    switch (node_type) {
        case "GROUP":
            items = {
                "GROUP": { name: "New Sub Group..", icon: "S_FOLDER" },
                "APP": { name: "New App...", icon: "BW_ROLE" },
                "sep1": "---------",
                "delete_app": { name: "Delete", icon: "delete" }
            };
            break;
        case "APP":
            items = {
                "CATALOG": { name: "View Catalog..", icon: "BW_ROLE" },
                "DESIGN": { name: "Design Layout..", icon: "BO_DASHBOARD" },
                "VIEW": { name: "Launch App..", icon: "BO_DASHBOARD" },
                "sep1": "---------",
                "delete_app": { name: "Delete", icon: "delete" }
            };
            break;
        case "REPORT_GROUP":
            items = {
                "report": {
                    name: "New Report...", icon: "report", items:
                    {
                        "BO_WEBI": { name: "Webi", icon: "BO_WEBI" },
                        "BO_CRYSTAL": { name: "Crystal", icon: "BO_CRYSTAL" },
                        "BW_BEX7": { name: "Bex7", icon: "BW_BEX7" },
                        "BW_BEX3": { name: "Bex3", icon: "BW_BEX3" },
                        "BO_DASHBOARD": { name: "Dashboard (BO)", icon: "BO_DASHBOARD" },
                        "BW_DASHBOARD": { name: "Dashboard (BW)", icon: "BO_DASHBOARD" },
                        "BO_ANALYSIS": { name: "Analysis", icon: "BO_ANALYSIS" },
                        "BO_EXPLORER": { name: "Explorer", icon: "BO_EXPLORER" },
                        "BO_DESIGN": { name: "Design Studio", icon: "BO_DASHBOARD" },
                        "FLASH": { name: "Flash", icon: "BO_WEBI" },
                        "URL": { name: "Generic URL", icon: "BO_EXPLORER" },
                        // changed the KPI CHART to HTML5 Charts
                        "KPI": { name: "HTML5 Chart", icon: "BO_CRYSTAL" },
                        "BW_WAD3": {name: "WAD3.X Template",icon:"BW_BEX3"},
                        "BW_WAD7": {name: "WAD7.X Template",icon:"BW_BEX7"}


                    }
                },
                "sep1": "---------",
                "delete": { name: "Delete", icon: "delete" }
            };
            break;
        case "M_FOLDER":
        case "S_FOLDER":
            items = {
                "S_FOLDER": { name: "New Folder..", icon: "S_FOLDER" },
                "BW_ROLE": { name: "New Role...", icon: "BW_ROLE" },
                "REPORT_GROUP": { name: "New Report Group...", icon: "REPORT_GROUP" },
                "report": {
                    name: "New Report...", icon: "report", items:
                    {
                        "BO_WEBI": { name: "Webi", icon: "BO_WEBI" },
                        "BO_CRYSTAL": { name: "Crystal", icon: "BO_CRYSTAL" },
                        "BW_BEX7": { name: "Bex7", icon: "BW_BEX7" },
                        "BW_BEX3": { name: "Bex3", icon: "BW_BEX3" },
                        "BO_DASHBOARD": { name: "Dashboard (BO)", icon: "BO_DASHBOARD" },
                        "BW_DASHBOARD": { name: "Dashboard (BW)", icon: "BO_DASHBOARD" },
                        "BO_ANALYSIS": { name: "Analysis", icon: "BO_ANALYSIS" },
                        "BO_EXPLORER": { name: "Explorer", icon: "BO_EXPLORER" },
                        "BO_DESIGN": { name: "Design Studio", icon: "BO_DASHBOARD" },
                        "FLASH": { name: "Flash", icon: "BO_WEBI" },
                        "URL": { name: "Generic URL", icon: "BO_EXPLORER" },
                        // changed the KPI CHART to HTML5 Charts
                        "KPI": { name: "HTML5 Chart", icon: "BO_CRYSTAL" },
                        "BW_WAD3": {name: "WAD3.X Template",icon:"BW_BEX3"},
                        "BW_WAD7": {name: "WAD7.X Template",icon:"BW_BEX7"}

                    }
                },
                "sep1": "---------",
                "delete": { name: "Delete", icon: "delete" }
            };
            break;
        case "F": //unmodifiable due to being under a ROLE
            items = undefined;
            break;
        case "BW_ROLE":
        default:
            items = {
                "delete": { name: "Delete", icon: "delete" }
            };
            break;
    }
    return items;
}


function createMenu(node_type) {
    var items = getMenu(node_type);
    if (items) {
        $.contextMenu({
            zIndex: 10000,
            selector: '.dynatree-node[type="' + node_type + '"][editable="true"] ',
            callback: function (key, options) {
                var m = "clicked: " + key;
                //window.console && console.log(m) || alert(m);
                switch (key) {
                    case "delete":
                        if ($(bi_cat_tree_id).dynatree("getRoot").childList[0].data.key == options.$trigger.attr('nodeid')) {
                            //alert('Root Level node cannot be deleted.');
                            BOI.BOILib.Util.log('Root Level node cannot be deleted.',true);
                        }
                        else {
                            //edited by otaism2a on 2/16/2014, to use jquery ui dialog
                            BOI.boiPrompt("BOI Message", 'Are you sure you want to delete ' + options.$trigger.find('a').text() + '?', false, function () {
                                deleteNode(options.$trigger.attr('nodeid'), options.$trigger.attr('key'));
                            }, function () {
                            });
                        }
                        break;
                    case "delete_app":
                        if ($(bi_app_tree_id).dynatree("getRoot").childList[0].data.key == options.$trigger.attr('nodeid')) {
                            //alert('Root Level node cannot be deleted.');
                            BOI.BOILib.Util.log('Root Level node cannot be deleted.',true);
                        }
                        else {
                            //edited by jaroudnh, otaism2a on 2/16/2014, to use jquery ui dialog
                            BOI.boiPrompt("BOI Message", 'Are you sure you want to delete ' + options.$trigger.find('a').text() + '?', false, function () {
                                deleteApp(options.$trigger.attr('nodeid'));
                            }, function () {
                            });
                        }
                        break;
                    case "CATALOG":
                        $('#accordion-west').accordion("option", "active", 1);
                        app_id = options.$trigger.attr('key');
                        BOIData.app_id = app_id;
                        current_app = {
                            data: {
                                key: app_id, type: key, title: 'New App', description: ' New..', editable: true,
                                href: '', nodeID: options.$trigger.attr('nodeid')
                            }
                        };
                        reloadTree(undefined, true);
                        $('#bi_cat_panel p').html('');
                        //var node = $(bi_cat_tree_id).dynatree("getRoot").childList[0];
                        //activateCatNode(node.data.key);
                        break;
                    case "DESIGN":
                        window.open("bi_apps_designer.html?app_id=" + options.$trigger.attr('key'));
                        break;
                    case "VIEW":
                        //Ansaj 2/Feb/2014 made the changes for open the application using the theme configuration
                            var theme= theme=BOI.context.parent.doc.defaultView.bi_node_details.app.THEME;
                            // if(($('iframe#bi_node_details')[0].contentWindow.app.THEME)!="")
                        if(theme!="")  {
                        //    window.open("bi_apps_view.html?app_id=" + options.$trigger.attr('key') + "&theme="+$('iframe#bi_node_details')[0].contentWindow.app.THEME);
                            window.open("bi_apps_view.html?app_id=" + options.$trigger.attr('key') + "&theme="+theme);
                        }
                        else {
                            window.open("bi_apps_view.html?app_id=" + options.$trigger.attr('key'));
                        }

                        break;
                    default:
                        current_node = {
                            data: {
                                key: undefined, type: key, title: 'New', description: '', editable: true,
                                nodeID: options.$trigger.attr('nodeid'), role: options.$trigger.attr('role')
                            }
                        };
                        if (key == "APP" || key == "GROUP") {
                            current_app = {
                                data: {
                                    key: undefined, type: key, title: 'New App', description: 'New..', editable: true,
                                    href: '', nodeID: options.$trigger.attr('nodeid')
                                }
                            };
                            $('#bi_node_details').attr('src', 'admin/bi_admin_app_edit.html');
                        }
                        else {
                            $('#bi_node_details').attr('src', 'admin/bi_admin_report_edit.html');
                            if (key == "KPI") {
                                current_node.data.url = 'comp/selection/bi_apps_comp_kpi_line.html';
                                $('#bi_kpi_details').attr('src', 'admin/bi_admin_kpi_edit.html');
                                //$('#drill_down_details').attr('src', 'admin/bi_admin_drill_down_det.htm');
                            }
                        }
                        setDisplay(key, 'CREATE');
                        break;
                }
            },
            items: items

        });
    }
}
</script>

<!-- Variables/KPIs Template Panel -->
<script type="text/javascript">

    var current_template;
    var templates = {};
    $(function () {
        refreshTemplates();

        $('[btn="bi_template_edit"][mode="V"]').live('click', function () {
            var mode = $(this).attr('mode');
            var id = $('#bi_var_template_id').val();
            templateDesigner(id, mode);
        });

        $('[btn="bi_template_edit"][mode="K"]').live('click', function () {
            var mode = $(this).attr('mode');
            var id = $('#bi_kpi_template_id').val();
            templateDesigner(id, mode);
        });

        $('[btn="bi_template_delete"][mode="K"]').live('click', function () {
            if (BOI.boiPrompt("BOI Message", 'Are you sure you want to delete ?',
                    false,
                    // ok function
                    function () {

                        var record = new BOIData.Record();
                        var param = new BOIData.Parameter();
                        param.name = 'TEMPLATE_ID';
                        param.values = [$('#bi_kpi_template_id').val()];
                        //alert(param.values);
                        record.parameters.push(param);
                        param = new BOIData.Parameter();
                        param.name = 'APP_ID';
                        param.values = [templates[$('#bi_kpi_template_id').val()].APP_ID];
                        record.parameters.push(param);
                        var req = BOIData.request.prepare('ZCL_MYBW_VAR_TEMPLATE', 'DELETE', [record]);
                        BOIData.request.perform(req, 'text', 'POST', function (data) {
                            current_template = undefined;
                            refreshTemplates();
                            //alert($(data).find('MESSAGE').text());
                            BOI.BOILib.Util.log($(data).find('MESSAGE').text(), true);
                        })

                    },
                    // cancel function
                    function () {
                    })
                    );


        });
        $('[btn="bi_template_delete"][mode="V"]').live('click', function () {
            if (BOI.boiPrompt("BOI Message", 'Are you sure you want to delete ?',
                    false,
                    // ok function
                    function () {
                        var record = new BOIData.Record();
                        var param = new BOIData.Parameter();
                        param.name = 'TEMPLATE_ID';
                        param.values = [$('#bi_var_template_id').val()];
                        //alert(param.values);
                        record.parameters.push(param);
                        param = new BOIData.Parameter();
                        param.name = 'APP_ID';
                        param.values = [templates[$('#bi_var_template_id').val()].APP_ID];
                        record.parameters.push(param);
                        var req = BOIData.request.prepare('ZCL_MYBW_VAR_TEMPLATE', 'DELETE', [record]);
                        BOIData.request.perform(req, 'text', 'POST', function (data) {
                            current_template = undefined;
                            refreshTemplates();
                            //alert($(data).find('MESSAGE').text());
                            BOI.BOILib.Util.log($(data).find('MESSAGE').text(), true);
                        })

                    },
                    //cancel function
                    function () {
                    })
                    );
        });

        $('[btn="bi_template_new"]').live('click', function () {
            var id = undefined;
            templateDesigner(id, $(this).attr('mode'));
        });
    });

    function refreshTemplates() {
        templates = {};
        BOIData.list.getTemplates(app_id, 'V', function (data) {
            $('#bi_var_template_id').html('');
            $(data).find('TEMPLATE').each(function () {
                var temp_id = $(this).find('TEMPLATE_ID').text();
                var temp_name = $(this).find('TEMPLATE_NAME').text();
                var temp_app_id = $(this).find('APP_ID').text();
                templates[temp_id] = { TYPE: 'V', APP_ID: temp_app_id, TEMPLATE_ID: temp_id, TEMPLATE_NAME: temp_name };
                var option = '<option value="' + temp_id + '">' + temp_name + '</option>';
                $('#bi_var_template_id').append(option);
            });

            setCurrentTemplate();
        });

        BOIData.list.getTemplates(app_id, 'K', function (data) {
            $('#bi_kpi_template_id').html('');
            $(data).find('TEMPLATE').each(function () {
                var temp_id = $(this).find('TEMPLATE_ID').text();
                var temp_name = $(this).find('TEMPLATE_NAME').text();
                var temp_app_id = $(this).find('APP_ID').text();
                templates[temp_id] = { TYPE: 'K', APP_ID: temp_app_id, TEMPLATE_ID: temp_id, TEMPLATE_NAME: temp_name };
                var option = '<option value="' + temp_id + '">' + temp_name + '</option>';
                $('#bi_kpi_template_id').append(option);
            });
            setCurrentTemplate();
        });
    }

    function setCurrentTemplate() {
        if (current_template) {
            if (current_template.TYPE == 'V') {
                $('#bi_var_template_id').val(current_template.TEMPLATE_ID);
                $('.bi_template_edit[mode="V"]').trigger('click');
            }
            else {
                $('#bi_kpi_template_id').val(current_template.TEMPLATE_ID);
                $('.bi_template_edit[mode="K"]').trigger('click');
            }
        }
    }

    function templateDesigner(template_id, type, name) {
        if (template_id)
            current_template = templates[template_id];
        else {
            if (app_id)
                current_template = { APP_ID: app_id, TEMPLATE_ID: undefined, TEMPLATE_NAME: "New..", TYPE: type };
            else
                current_template = { APP_ID: 'ALL', TEMPLATE_ID: undefined, TEMPLATE_NAME: "New..", TYPE: type };
        }


        $('#bi_template_design').attr('src', 'admin/bi_admin_layout_editor.html');

        var tabs = $("#tabs-center");
        //tabs.tabs( "option", "disabled", [] ); // hide non relevant
        tabs.tabs("option", "disabled", [0, 1, 2, 3, 5, 6, 7, 8]); // hide non relevant
        tabs.tabs({ active: 4 }); // select
        tabs.tabs("option", "selected", 4); // hide non relevant
        tabs.tabs("option", "active", 4); // hide non relevant
        $('#tab-panel-center-3').click();
    }
</script>

<!-- Views Manager Panel -->
<script type="text/javascript">

    var current_view;
    $(function () {

        refreshViews();

        $('[btn="bi_view_edit"]').live('click', function () {
            var mode = $(this).attr('mode');
            var id = $('#bi_view_template_id').val();
            var name = $('#bi_view_template_id').find('option:selected').text();
            var app_id = $('#bi_view_template_id').find('option:selected').attr('app_id');
            viewEditor(id, name, app_id);
        });

        $('[btn="bi_view_delete"]').live('click', function () {
            if (BOI.boiPrompt("BOI Message", 'Are you sure you want to delete ?',
                    false,
                    // ok function
                    function () {
                        var record = new BOIData.Record();
                        var param = new BOIData.Parameter();
                        param.name = 'VIEW_ID';
                        param.values = [$('#bi_view_template_id').val()];
                        record.parameters.push(param);
                        var req = BOIData.request.prepare('ZCL_MYBW_VAR_VIEW', 'DELETE', [record]);
                        BOIData.request.perform(req, 'text', 'POST', function (data) {
                            if ($(data).find('STATUS').text() == 'S') {
                                current_view = undefined;
                                refreshViews();
                            }
                            // alert($(data).find('MESSAGE').text());
                            BOI.BOILib.Util.log($(data).find('MESSAGE').text(), true);
                        })

                    },
                    //cancel function
                    function () {
                    })
                    );
        });

        $('[btn="bi_view_new"]').live('click', function () {
            var id = undefined;
            var name = "New..";
            if (app_id && app_id != '')
                viewEditor(id, name, app_id);
            else
                viewEditor(id, name, 'ALL');
        });
    });

    function refreshViews() {
        BOIData.list.getVariableViews(app_id, function (data) {
            $('#bi_view_template_id').html('');
            $(data).find('VIEW').each(function () {
                var option = '<option value="' + $(this).find('VIEW_ID').text() + '" app_id="' + $(this).find('APP_ID').text() + '">' + $(this).find('VIEW_NAME').text() + '</option>';
                $('#bi_view_template_id').append(option);
            });

            setCurrentView();
        });
    }

    function setCurrentView() {
        if (current_view) {
            $('#bi_view_template_id').val(current_view.VIEW_ID);
            $('.bi_view_edit').trigger('click');
        }
    }

    function viewEditor(view_id, name, app_id) {
        current_view = { VIEW_ID:view_id, VIEW_NAME:name, APP_ID:app_id };

        $('#bi_view_details').attr('src', 'admin/bi_admin_view_editor.html');

        var tabs = $("#tabs-center");
        tabs.tabs("option", "disabled", []); // hide non relevant
        tabs.tabs({ active:5 }); // select
        tabs.tabs("option", "selected", 5); // hide non relevant
        tabs.tabs("option", "active", 5); // hide non relevant
        $('#tab-panel-center-6').click();
        tabs.tabs("option", "disabled", [0, 1, 2, 3, 4, 6, 7, 8]); // hide non relevant
    }
</script>

<!-- Components Manager Panel -->
<script type="text/javascript">

    var current_comp;
    $(function () {
        refreshComponents();

        $('[btn="bi_comp_edit"]').live('click', function () {
            var id = $('#bi_comp_template_id').val();
            var name = $('#bi_comp_template_id').find('option:selected').text();
            var app_id = $('#bi_comp_template_id').find('option:selected').attr('app_id');
            compEditor(id, name, app_id);
        });

        $('[btn="bi_comp_delete"]').live('click', function () {
            if (BOI.boiPrompt("BOI Message", 'Are you sure you want to delete ?',
                    false,
                    // ok function
                    function () {
                        var record = new BOIData.Record();
                        var param = new BOIData.Parameter();
                        param.name = 'COMP_ID';
                        param.values = [$('#bi_comp_template_id').val()];
                        record.parameters.push(param);
                        var param = new BOIData.Parameter();
                        param.name = 'APP_ID';
                        param.values = [$('#bi_comp_template_id').find('option:selected').attr("app_id")];
                        record.parameters.push(param);
                        var req = BOIData.request.prepare('ZCL_MYBW_COMPONENT', 'DELETE', [record]);
                        BOIData.request.perform(req, 'text', 'POST', function (data) {
                            if ($(data).find('STATUS').text() == 'S') {
                                current_comp = undefined;
                                refreshComponents();
                            }
                            // alert($(data).find('MESSAGE').text());
                            BOI.BOILib.Util.log($(data).find('MESSAGE').text(), true);
                        })

                    },
                    // cancel function
                    function () {
                    })
                    );
        });

        $('[btn="bi_comp_new"]').live('click', function () {
            var id = undefined;
            var name = "New..";
            if (app_id && app_id != '')
                compEditor(id, name, app_id);
            else
                compEditor(id, name, 'ALL');
        });
    });

    function refreshComponents() {
        BOIData.list.getComponents(app_id, function (data) {
            $('#bi_comp_template_id').html('');
            $(data).find('COMPONENT').each(function () {
                var option = '<option value="' + $(this).find('COMP_ID').text() + '" app_id="' + $(this).find('APP_ID').text() + '">' + $(this).find('TITLE').text() + '</option>';
                $('#bi_comp_template_id').append(option);
            });
            $('.bi_comp_new').trigger('click');
            setCurrentComponent();
        });
    }

    function setCurrentComponent() {
        if (current_comp) {
            $('#bi_comp_template_id').val(current_comp.COMP_ID);
            $('.bi_comp_edit').trigger('click');
        }
    }

    function compEditor(comp_id, name, app_id) {
        current_comp = { APP_ID: app_id, COMP_ID: comp_id, TITLE: name };
        //current_comp = { id: comp_id, name: name, app_id: app_id };

        $('#bi_comp_details').attr('src', 'admin/bi_admin_comp_editor.html');

        var tabs = $("#tabs-center");
        tabs.tabs("option", "disabled", []); // hide non relevant
        tabs.tabs({ active: 7 }); // select
        tabs.tabs("option", "selected", 7); // hide non relevant
        tabs.tabs("option", "active", 7); // hide non relevant
        $('#tab-panel-center-8').click();
        tabs.tabs("option", "disabled", [0, 1, 2, 3, 4, 5, 6, 8]); // hide non relevant
    }
</script>

</head>
<body>
<div class="wrapper">
    <div class="header">
        <div class="icon-bi_admin">
        </div>
        <div class="top-nav">
            <ul>
                <li class="home"><a>Home</a></li>
                <li class="access"><a>Access</a></li>
                <li class="log"><a>Log</a></li>
            </ul>
            <div class="welcome">
                <p>Welcome&nbsp; <span><%=sy-uname%></span></p>
            </div>
        </div>
        <div class="clear"></div>
    </div>
    <!--Context Menu Sample
<ul class="context-menu-list context-menu-root" style="left: 115px; top: 435px; width: 122px; z-index: 10200;">
    <li class="context-menu-item icon icon-BW_ROLE"><span>View Catalog..</span></li>
    <li class="context-menu-item icon icon-BO_DASHBOARD"><span>Design Layout..</span></li>
    <li class="context-menu-item icon icon-BO_DASHBOARD"><span>Launch App..</span></li>
    <li class="context-menu-item context-menu-separator not-selectable"></li>
    <li class="context-menu-item icon icon-delete"><span>Delete</span></li>
</ul>
    -->
    <div class="container">
        <div class="sidebar ui-layout-west">
            <div id="accordion-west" class="accordion">
                <h3 class="accordion-header"><a id="bi_app_cat_current" href="#">BI Apps</a></h3>
                <div class="accordion-content accord-bi-apps">
                    <div class="inner">
                        <div class="search-block">
                            <ul>
                                <li>
                                    <p>Search</p>
                                </li>
                                <li>
                                    <input class="side-textbox" id="bi_apps_tree_search" type="text" /></li>
                                <li><a class="button2-WY" id="bi_apps_tree_search_next" title="Find Next Match"><span>Next</span></a></li>
                            </ul>
                        </div>
                        <div class="bi-apps-tree">
                            <div class="scroll-cover">
                                <div class="custom-scroll left-menu">
                                    <div class="hierarchy" id="bi_apps_tree"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <h3 class="accordion-header ui-state-disabled first_not_enabled"><a id="bi_rep_cat_current" href="#">Current Report Catalog</a></h3>
                <div id="bi_cat_panel" class="accordion-content accord-report-catalog">
                    <div class="inner">
                        <div class="search-block">
                            <ul>
                                <li>
                                    <p>Search</p>
                                </li>
                                <li>
                                    <input id="bi_cat_tree_search" class="side-textbox" type="text"></li>
                                <li><a id="bi_cat_tree_search_next" class="button2-WY" title="Find Next Match"><span>Next</span></a></li>
                            </ul>
                        </div>
                        <div class="bi-cat-tree">
                            <div class="scroll-cover">
                                <div class="custom-scroll left-menu">
                                    <div class="hierarchy" id="bi_cat_tree"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <h3 class="accordion-header ui-state-disabled first_not_enabled"><a id="bi_var_temp" href="#">Variables Template Designer</a></h3>

                <div class="accordion-content accord-var-designer">
                    <div class="inner">
                        <select id="bi_var_template_id"></select>
                        <ul class="controls">
                            <li><a href="#" class="button2-WY" btn="bi_template_edit" mode="V" title="Edit"><span>Edit</span></a></li>
                            <li><a class="button2-WY" btn="bi_template_delete" mode="V" title="Delete"><span>Delete</span></a></li>
                            <li><a class="button2-WY" btn="bi_template_new" mode="V" title="New"><span>New</span></a></li>
                        </ul>
                    </div>
                </div>

                <h3 class="accordion-header ui-state-disabled first_not_enabled"><a id="bi_rep_temp" href="#">Report Template Designer</a></h3>
                <div class="accordion-content accord-rep-designer">
                    <div class="inner">
                        <select id="bi_kpi_template_id"></select>
                        <ul class="controls">
                            <li><a class="button2-WY" btn="bi_template_edit" mode="K" title="Edit"><span>Edit</span></a></li>
                            <li><a class="button2-WY" btn="bi_template_delete" mode="K" title="Delete"><span>Delete</span></a></li>
                            <li><a class="button2-WY" btn="bi_template_new" mode="K" title="New"><span>New</span></a></li>
                        </ul>
                    </div>
                </div>
                <h3 class="accordion-header ui-state-disabled first_not_enabled"><a id="bi_var_views" href="#">Variable Views Manager</a></h3>
                <div class="accordion-content accord-views-manager">
                    <div class="inner">
                        <select id="bi_view_template_id"></select>
                        <ul class="controls">
                            <li><a class="button2-WY" btn="bi_view_edit" title="Edit"><span>Edit</span></a></li>
                            <li><a class="button2-WY" btn="bi_view_delete" title="Delete"><span>Delete</span></a></li>
                            <li><a class="button2-WY" btn="bi_view_new" title="New"><span>New</span></a></li>
                        </ul>
                    </div>
                </div>
                <h3 class="accordion-header ui-state-disabled first_not_enabled"><a id="bi_comp_man" href="#">Components Manager</a></h3>
                <div class="accordion-content accord-comp-manager">
                    <div class="inner">
                        <select id="bi_comp_template_id"></select>
                        <ul class="controls">
                            <li><a class="button2-WY" btn="bi_comp_edit" title="Edit"><span>Edit</span></a></li>
                            <li><a class="button2-WY" btn="bi_comp_delete" title="Delete"><span>Delete</span></a></li>
                            <li><a class="button2-WY" btn="bi_comp_new" title="New"><span>New</span></a></li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
        <div class="main-container ui-layout-east">
            <div class="content">
                <div id="tabs-center" class="tabs">
                    <ul class="tab-title">
                        <li><a href="#tab-panel-center-1"><span>Layout Editor</span></a></li>
                        <li><a href="#tab-panel-center-2"><span>Variables</span></a></li>
                        <li><a href="#tab-panel-center-4"><span>Variables Layout</span></a></li>
                        <li><a href="#tab-panel-center-5"><span>Variables Preview</span></a></li>
                        <li><a href="#tab-panel-center-3"><span>Template Designer</span></a></li>
                        <li><a href="#tab-panel-center-6"><span>View Details</span></a></li>
                        <li><a href="#tab-panel-center-7"><span>Reports Layout</span></a></li>
                        <li><a href="#tab-panel-center-8"><span>Component Details</span></a></li>
                        <li><a href="#tab-panel-center-9"><span>KPI Definition</span></a></li>
                        <!--li><a href="#tab-panel-center-10"><span>Drill-down Details</span></a></li-->
                    </ul>
                    <div class="tab-content">
                        <div class="tab-content-inner">
                            <div id="tab-panel-center-1" class="">
                                <!--<iframe id="bi_node_details" src="comp/bi_admin_kpi_edit.html"></iframe>-->
                                <iframe id="bi_node_details"></iframe>
                            </div>
                            <div id="tab-panel-center-2" class="">
                                <iframe id="bi_node_var_edit"></iframe>
                            </div>
                            <div id="tab-panel-center-4" class="">
                                <iframe id="bi_node_var_assign"></iframe>
                            </div>
                            <div id="tab-panel-center-5" class="">
                                <iframe src="comp/bi_variable_screen.html"></iframe>
                            </div>
                            <div id="tab-panel-center-3" class="">
                                <iframe id="bi_template_design"></iframe>
                            </div>
                            <div id="tab-panel-center-6" class="">
                                <iframe id="bi_view_details"></iframe>
                            </div>
                            <div id="tab-panel-center-7" class="">
                                <iframe id="bi_node_rep_assign"></iframe>
                            </div>
                            <div id="tab-panel-center-8" class="">
                                <iframe id="bi_comp_details"></iframe>
                            </div>
                            <div id="tab-panel-center-9" class="">
                                <iframe id="bi_kpi_details"></iframe>
                            </div>
                            <!--div id="tab-panel-center-10" class="">
                                <iframe id="drill_down_details"></iframe>
                            </div-->
                        </div>
                    </div>

                </div>
            </div>
        </div>
        <div class="clear"></div>
    </div>
    <div class="footer">
        <div class="credits-cover">
            <div class="credits"></div>
        </div>
        <div class="copyright">
            <p>Copyright &copy; <span class="year"></span>&nbsp;<a>Saudi Aramco</a>. All Rights Reserved.</p>
        </div>
        <div class="bottom-links">
            <ul>
                <li><a href="#">Help</a></li>
                <li><a href="#">Sharek</a></li>
                <li><a href="#">Business Intelligence</a></li>
            </ul>
        </div>
        <div class="clear"></div>
    </div>
</div>



</body>


</html>
